<!-- <ma-crumb>
  <ma-crumb-item ma-href="#!/components">Components 组件</ma-crumb-item>
  <ma-crumb-item ma-href="#!/components/global">Global 全局</ma-crumb-item>
  <ma-crumb-item>Font 文字</ma-crumb-item>
</ma-crumb> -->
<ma-crumb-auto></ma-crumb-auto>
<div class="general-button-page">
  <div class="container"
    ma-full-container>
    <h2>Button 按钮</h2>
    <p>按钮用于开始一个即时操作。</p>
    <h3>代码演示</h3>
    <div class="p clearfix">
      ${require('./code.html')}
      <div class="col-24 pt-10">
        <ma-code>
          <div class="right">
            <a href="https://jsfiddle.net/youpinyao/q3bw0zsz/"
              target="_blank">jsfiddle</a>
          </div>
          <code ng-bind="codeText"></code>
        </ma-code>
      </div>
    </div>

    <h3>API</h3>
    <div class="p">
      <table>
        <tr>
          <th>属性</th>
          <th>说明</th>
          <th>类型</th>
          <th>默认值</th>
        </tr>
        <tr>
          <td>ma-click</td>
          <td>点击触发事件，除了 button 其他地方也可以使用，只要注入 button 组件</td>
          <td>String</td>
          <td>-</td>
        </tr>
        <tr>
          <td>ma-size</td>
          <td>按钮尺寸 large default small</td>
          <td>String</td>
          <td>default</td>
        </tr>
        <tr>
          <td>ma-type</td>
          <td>按钮类型 default primary danger</td>
          <td>String</td>
          <td>default</td>
        </tr>
        <tr>
          <td>ma-flat</td>
          <td>是否开启无背景模式</td>
          <td>Boolean</td>
          <td>false</td>
        </tr>
        <tr>
          <td>ma-active</td>
          <td>是否是活动状态</td>
          <td>Boolean</td>
          <td>false</td>
        </tr>
        <tr>
          <td>ma-loading</td>
          <td>是否显示loading icon</td>
          <td>Boolean</td>
          <td>false</td>
        </tr>
        <tr>
          <td>ng-disabled</td>
          <td>是否为不可用状态</td>
          <td>Boolean</td>
          <td>false</td>
        </tr>
      </table>
    </div>
  </div>
</div>
